import React,{useEffect} from 'react'
import {Image, TouchableOpacity, View} from 'react-native';
import Main from './pages/Main'
import {Provider as MobxProvider} from 'mobx-react'
import {stores} from './store'

import {AlertModal,AppModal,DialogTip} from './widgets/modal';
import screen from './utils/screen';
import Images from './images/Images';
import {AppInfo} from './utils/common';
import Constants from './utils/Constants';
import ServiceDialog from './components/ServiceDialog';

const App = ()=>{


  useEffect(()=>{

    global.countryid = Constants.countryid

    console.log('app start')
    setTimeout(()=>{

    }, 2000)
  },[])


  const renderHelpBtn = ()=>{
    return (
      <TouchableOpacity
        activeOpacity={0.7}
        style={{ position: 'absolute', bottom: screen.PIXEL_120, right: 10 }}
        onPress={() => {
          console.log(AppInfo.helpdata)
          if (AppInfo.helpdata ) {
            if (AppInfo.helpdata.disable) {
              AppModal.showTip(Constants.common.function_disabled)
            } else {
              AppModal.showHelp()
            }
          }

        }} >
        <View style={{ alignItems: 'center', justifyContent: 'center' }}>
          <Image
            source={Images.help}
            resizeMode={'contain'}
            style={{ width: screen.PIXEL_90, height:screen.PIXEL_130 }}
          />
        </View>
      </TouchableOpacity>
    )
  }
  return (

    <View style={{flex:1}}>

      <MobxProvider {...stores}>
        <Main/>
      </MobxProvider>

      <AlertModal
        ref={ref=>{
          AppModal.setModalRef(ref)
        }}
      />

      <DialogTip
        ref={ref=>{
          AppModal.setTipRef(ref)
        }}
      />

      {renderHelpBtn()}

      <ServiceDialog
        ref={ref=> {
          AppModal.setHelpRef(ref)
        }}

      />
    </View>

  )
}

export default App
